import React from 'react'
import { StyleSheet, Text, View } from 'react-native'
import Avatar from '../avatar/Avatar';
import HeartBtn from '../button/HeartBtn'

const CommentItem = () => {
  return (
    <View style={styles.commentItem}>
      {/* 头像 */}
      <Avatar uri='http://5b0988e595225.cdn.sohucs.com/images/20170724/ad28da0d658b43aba84ce91df9cacdad.jpeg' />
      {/* 评论的内容 (数据先暂时写死 以后可以定义属性 从父组件传过来) */}
      <View style={styles.commentBox}>
        {/* 评论人名字 */}
        <Text style={styles.commentName}>三木森</Text>
        <Text style={styles.commentCont}>
          还不错还不错还不错还不错还不错还不错还不错还不错还不错还不错还不错
        </Text>
      </View>
      {/* 点赞的心 */}
      <HeartBtn number="23.3w" />
    </View>
  )
}

export default CommentItem

const styles = StyleSheet.create({
  commentItem: {
    flexDirection: 'row',
    alignItems: 'center',
    padding: 10,
  },
  commentBox: {
    flex: 1,
    paddingLeft: 10,
    paddingRight: 10
  },
  commentName: {
    color: 'white',
    fontWeight: 'bold',
    fontSize: 18
  },
  commentCont: {
    color: 'white'
  }
})
